<template>
    <div class="page-admin">
        <ul>
            <li v-for="user in users" :key="user.id" @click="toRoom(user)">
                <img :src="user.avatar" />
                <span>{{user.name}}</span>
            </li>
        </ul>
    </div>
</template>

<script>
import { mapState, mapActions, mapMutations } from 'vuex';

export default {
    name: "administer",
    data() {
        return {
            users: []
        }
    },
    mounted() {
        this.getUsers()
    },
    methods: {
        getUsers() {
            this.axios.get("user/all").then(res => {
                this.users = res.data.data;
            })
        },
        toRoom(user) {
            this.axios.post("room/addMember", { roomId: "5b3b2134e7f541b61d4ee40e", memberId: user.id }).then(res => {
            	console.log(res)
            })
        }
    }
};
</script>

<style scope>
.page-admin img {
	width: 50px;
}
</style>
